/*
 * @Author: your name
 * @Date: 2020-10-30 14:10:07
 * @LastEditTime: 2020-10-30 14:30:03
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: /crowd-funding/src/components/pages/header/headerTitle/index.js
 */
import React from 'react'
import share from '../images/share.png'
import './index.scss'
import { useDispatch, useSelector } from 'react-redux'
import { navigatorBackByH5 } from '@jmfe/jm-webview'
import { reportClick } from '@/utils/ping'
import { projectId } from '@/utils/constants'
import { get } from 'lodash'

export const HeaderTitle = (props) => {
	const { statusHeight, showNavTitle } = props
	const dispatch = useDispatch()

	const homeData = useSelector((state) => state.homeData)
	const storyPageData = get(homeData, 'storyPageData', {})
	const projectStoryNewDto = get(storyPageData, 'projectStoryNewDto', {})
	const buttonStatus = get(projectStoryNewDto, 'buttonStatus', 0)

	const handleBack = () => {
		// 返回事件
		reportClick({
			eventId: 'Mhelp_StoryDetail_Topback',
			eventParam: `${projectId}_${buttonStatus}`,
		}).then(() => {
			navigatorBackByH5()
		})
	}
	const toShare = () => {
		reportClick({
			eventId: 'Mhelp_StoryDetail_Share',
			eventParam: `${projectId}_${buttonStatus}`,
		}).then(() => {
			dispatch({ type: 'common:share', payload: { shareType: 'callSharePane' } })
		})
	}
	return (
		<div className="header">
			<div
				className="headerTitle"
				style={{
					paddingTop: statusHeight,
					height: 44 + statusHeight,
					backgroundColor: showNavTitle ? '#fff' : 'transparent',
				}}>
				<div className="leftBack">
					{/* 返回 */}
					<div onClick={handleBack} className="back-icon">
						<img
							className="leftBackImg"
							src="https://img10.360buyimg.com/imagetools/jfs/t1/153615/31/3757/338/5f98f6efE3a50fb64/15aac5f678125395.png"
						/>
					</div>
					{showNavTitle ? <div className="nav-title">京东众筹</div> : null}
				</div>
				<div className="rightShare" onClick={toShare}>
					{/* 分享 */}
					<img src={share} className="rightShareImg" />
				</div>
			</div>
		</div>
	)
}

export const TitleDate = (props) => {
	const { navHeight, statusHeight } = props
	return (
		<div
			className="jdTitle"
			style={{
				marginTop: navHeight + statusHeight,
			}}>
			京东众筹
		</div>
	)
}
